<template>
    <div class="friend-ship-link" v-if="friendshipLink.length">
        <div class="friend-ship-link__container">
            <div class="friend-ship-link__title">友情链接：</div>
            <a
                :href="item.link"
                class="friend-ship-link__item"
                target="_blank"
                v-for="item in friendshipLink"
                :key="item.id"
            >
                {{ item.name }}
            </a>
        </div>
    </div>
</template>
<script setup>
import { useContent } from ".";
const { GetList, friendshipLink } = useContent();
await GetList();
</script>
<style lang="scss" scoped>
.friend-ship-link {
    padding: 30px 0;
    background-color: #030619;
    border-bottom: 1px solid #353847;

    &__container {
        display: flex;
        flex-wrap: wrap;
        max-width: 1439px;
        width: 95%;
        margin: 0 auto;
        color: #9a9ba3;
        font-size: 16px;
    }

    &__title {
        margin-right: 20px;
        line-height: 30px;
    }

    &__item {
        color: #9a9ba3;
        margin-right: 20px;
        text-decoration: none;
        line-height: 30px;

        &:hover {
            color: #5085fb;
            text-decoration: underline;
        }
    }
}
</style>
